import React, { useEffect, useState } from 'react'
import MyNavbar from '../../../components/MyNavbar'
import request from '../../../api/request'
import { useParams, useSearchParams } from 'react-router-dom'
import styles from './css/index.module.css'
import { NoticeBar } from 'antd-mobile'
function Index() {
    const {id}=useParams()
    const [sp]=useSearchParams()
    const spObj=Object.fromEntries(sp)
    

    
    const [data,setData]=useState([])
    useEffect(()=>{
        request.get('/share/knowledgeBase/v1/findDrugsKnowledge',{params:{id:id}}).then((res)=>{
            console.log(res);
            setData(res.data.result)
        })
    },[])

  return (
    <div className={styles.box}>
      <MyNavbar/>
      <NoticeBar icon={false} content={
        <div style={{fontSize:'14px'}}><span>本模块知识仅供参考，如有需要，请在医生指导下使用</span></div>
      } color='error' />

        <h3 style={{margin:'10px 0'}}>{spObj.title}</h3>
        
      <div className={styles.content}>
        <span>
           <p> <a>{'[药品成分]'}</a></p>
            {data.component&&data.component.length>0? <span>{data.component}</span>:<span>无</span>}
            
        </span>
        <span>
           <p> <a>{'[用药禁忌]'}</a></p>
            {data.taboo&&data.taboo.length>0? <span>{data.taboo}</span>:<span>无</span>}
        </span>
        <span>
           <p> <a>{'[主治功能]'}</a></p>
            {data.effect&&data.effect.length>0? <span>{data.effect}</span>:<span>无</span>}

        </span>
        <span>
           <p> <a>{'[用法用量]'}</a></p>
            {
                data.usage&&data.usage.length>0?<span>{data.usage}</span>:<span>无</span>
            }
            
        </span>
        <span>
           <p> <a>{'[药品性状]'}</a></p>
            {data.shape&&data.shape.length>0? <span>{data.shape}</span>:<span>无</span>}
        </span>
         <span>
           <p> <a>{'[包装规格]'}</a></p>
            {data.packing&&data.packing.length>0? <span>{data.packing}</span>:<span>无</span>}
        </span>
         <span>
           <p> <a>{'[不良反应]'}</a></p>
            {data.sideEffects&&data.sideEffects.length>0? <span>{data.sideEffects}</span>:<span>无</span>}
        </span>
      </div>

      

    </div>
  )
}

export default Index
